<template>
    <div class="container">
        <h2>姓名：{{ name }}---年龄：{{ age }}</h2>
    </div>
    <div >
        <button @click="setAge">年龄+1</button>
        <button @click="setName">姓名修改</button>
    </div>
</template>

<script setup>
    import {ref} from "vue";//ref 是vue3 提供的一个函数，用于创建一个响应式的变量 基本数据类型
     const name = ref('zhangsan');
    const age  = ref(18);

    function setAge(){age.value += 1;}
    function setName(){name.value += '~'}
</script >

<style scoped>
</style>